<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>设置线宽</title>
</head>
<body>
<div id="canvas-warp">
    <canvas id="canvas"></canvas>
</div>
<script>

    var canvas = document.getElementById("canvas");
    canvas.height = 800;
    canvas.width = 800;
    canvas.style.border = "1px dotted red";


    var ctx = canvas.getContext("2d");
    ctx.moveTo( 100 , 100);
    ctx.lineTo( 300 , 100);
    ctx.stroke();

    ctx.beginPath();
    ctx.lineWidth = 10;
    ctx.moveTo( 100 , 250);
    ctx.lineTo( 300 , 250);
    ctx.stroke();
</script>
</body>
</html>